<!-- 拉新趋势 -->
<template>
    <view>
        <status-bar title='拉新趋势' :goHome='fromShare'></status-bar>
        <view class="padding30">
            <view class="card bgwhite bor_radius_6 padding20">
                <view class="size30 color_22 bold">24小时拉新趋势</view>
                <column :raw-data="pageData.day_recruit_chart" :item-count="8"></column>
                <view class="size30 color_22 bold text-center m-top60 m-bot60">地区比</view>
                <ring :raw-data="pageData.day_recruit_area_pie"></ring>
            </view>
            <view class="card bgwhite bor_radius_6 padding20 m-top50">
                <view class="size30 color_22 bold">月拉新趋势</view>
                <column :raw-data="pageData.month_recruit_chart" :item-count="6"></column>
                <view class="size30 color_22 bold text-center m-top60 m-bot60">地区比</view>
                <ring :raw-data="pageData.month_recruit_area_pie"></ring>
            </view>
            <view class="card bgwhite bor_radius_6 padding20 m-top50">
                <view class="size30 color_22 bold">年拉新趋势</view>
                <column :raw-data="pageData.year_recruit_chart"></column>
                <view class="size30 color_22 bold text-center m-top60 m-bot60">地区比</view>
                <ring :raw-data="pageData.year_recruit_area_pie"></ring>
            </view>
        </view>
    </view>
</template>

<script>
import column from '../components/column.vue'
import ring from '../components/ring.vue'
export default {
    data(){
        return {
            fromShare: 0,
            pageData: ''
        }
    },
    components: {
        column,
        ring
    },
    onLoad(){
        this.$http.get({
            url: '/PrivateSphereApi/recruitTrend'
        }).then(res=>{
            if(res.code != 200) return this.$Toast(res.msg)
            this.pageData = res.data
        })
    }
}
</script>

<style lang="scss" scoped>
.card {  
    box-shadow: 0rpx 4rpx 11rpx 1rpx rgba(0,0,0,0.1);
}
</style>